<template>
  <div>
    <el-table :data="lends" border style="width: 100%">
      <el-table-column label="序号" width="50" type="index"></el-table-column>
      <el-table-column
        prop="lendNo"
        label="标的编号"
        width="180"
      ></el-table-column>
      <el-table-column prop="amount" label="标的金额"></el-table-column>
      <el-table-column prop="period" label="投资期数"></el-table-column>
      <el-table-column prop="lendYearRate" label="年化利率">
        <template slot-scope="scope">
          {{ scope.row.lendYearRate * 100 + '%' }}
        </template>
      </el-table-column>
      <el-table-column prop="investAmount" label="已投金额"></el-table-column>
      <el-table-column prop="investNum" label="投资人数"></el-table-column>
      <el-table-column prop="publishDate" label="发布时间"></el-table-column>
      <el-table-column prop="lendStartDate" label="开始日期"></el-table-column>
      <el-table-column prop="lendEndDate" label="结束日期"></el-table-column>
      <el-table-column prop="lendStatus" label="状态"></el-table-column>
      <el-table-column label="操作" width="180">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="primary"
            @click="handleShow(scope.$index, scope.row)"
          >
            查看
          </el-button>
          <el-button
            size="mini"
            type="warning"
            @click="handleApply(scope.$index, scope.row)"
          >
            放款
          </el-button>
          <el-button
            size="mini"
            type="primary"
            @click="handleShowLendReturns(scope.$index, scope.row)"
          >
            还款计划
          </el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
import lendApi from '@/api/lend'
export default {
  data() {
    return {
      lends: [],
    }
  },
  created() {
    this.list()
  },
  methods: {
    handleApply(idx, row) {
      //放款单击事件
      lendApi.commitApply(row.id).then((r) => {
        this.$message.success(r.message)
        this.list()
      })
    },
    handleShowLendReturns(idx, row) {
      this.$router.push('/lend/lend-return/' + row.id)
    },
    //查看标的详情
    handleShow(idx, row) {
      //携带标的的id跳转到下一个页面
      this.$router.push('/lend/detail/' + row.id)
    },
    handleDelete(idx, row) {},
    list() {
      lendApi.list().then((r) => {
        this.lends = r.data.items
      })
    },
  },
}
</script>
